<template>
    <div class="recommend">
        <div v-for="item in recommend" :key="item.link" class="recommend-item">
            <a :href="item.link">
                <img :src="item.image" alt="">
                <div>{{item.title}}</div>
            </a>
        </div>
    </div>
</template>
<script>
export default {
    name:"HomeRecommend",
    data(){
        return {

        }
    },
    props:["recommend"]
}
</script>
<style lang="css" scoped>
    .recommend{
        width: 100%;
        display: flex;
        text-align: center;
        padding-bottom:15px; 
        border-bottom: 10px solid #e7e7e7;
    }
    .recommend-item{
        flex: 1;
        font-size: 15px;
    }
    .recommend-item img{
        width: 65px;
        height: 65px;
        display: inline-block;
        margin: 10px 0px 15px 0px;
    }
</style>